import Vue from 'vue'
import XEUtils from 'xe-utils'
import VXETable from 'vxe-table'
import 'vxe-table/lib/index.css'
import request from '@/router/axios'


function sendAjax (options, callback, defaultCallback) {
  if (options && !XEUtils.isArray(options)) {
    const ajaxOpts = Object.assign({ method: 'GET' }, XEUtils.isString(options) ? { url: options } : options)
    request(ajaxOpts).then(response => response.data).then(callback)
    if (defaultCallback) {
      defaultCallback()
    } else {
      callback()
    }
  }
}

// 设置默认参数
VXETable.setup({
  grid: {
    /**
     * Grid 封装统一的数据代理
     * 任何支持 Promise 的异步请求库都能对接，不同的库可能用法会不一样，基本大同小异（fetch、jquery、axios、xe-ajax）
     * 支持增删改查自动发送请求
     * 支持 filters 自动请求数据
     * 支持 edit-render 下拉框自动请求数据
     */
    proxyConfig: {
      // 列初始化之前
      beforeColumn ({ $grid, column }) {
        const { filters, editRender } = column
        // 处理筛选请求
        sendAjax(filters, data => {
          $grid.setFilter(column, data)
        }, () => {
          column.filters = []
        })
        // 处理渲染器请求
        if (editRender) {
          switch (editRender.name) {
            case 'select':
              sendAjax(editRender.options, data => {
                  if(data&&data.data&&data.data.records){
                      editRender.options = data.data.records
                      if(editRender.optionProps){
                          editRender.defaultValue = data.data.records[0][editRender.optionProps.value]
                      }

                  }else{
                      editRender.options = data || []
                  }

              })
              break
          }
        }
      },
      // 查询
      beforeQuery (params) {
        const { options, page, sort, filters,form } = params
        if (XEUtils.isFunction(options)) {
          return options(params)
        }
        // 处理排序条件
        const queryParams = {
          sort: sort.property,
          order: sort.order
        }
        // 处理筛选条件
        filters.forEach(({ property, values }) => {
          queryParams[property] = values.join(',')
        })
        const ajaxOpts = Object.assign({ method: 'GET', params: queryParams }, XEUtils.isString(options) ? { url: options } : options)
        ajaxOpts.params =  Object.assign(ajaxOpts.params,form)
        if (page) {
           // ajaxOpts.url = XEUtils.template(ajaxOpts.url, { page })
           ajaxOpts.params.current= page.currentPage
           ajaxOpts.params.size = page.pageSize
        }
        return request(ajaxOpts).then(response =>{
           return  response.data
        })
      },
      // 删除
      beforeDelete (params) {
        const { options, body } = params
        if (XEUtils.isFunction(options)) {
          return options(params)
        }
        const ajaxOpts = Object.assign({ method: 'POST', body }, XEUtils.isString(options) ? { url: options } : options)
        return request(ajaxOpts).then(response => response.data)
      },
      // 保存
      beforeSave (params) {
        const { options, body } = params
        if (XEUtils.isFunction(options)) {
          return options(params)
        }
        const ajaxOpts = Object.assign({ method: 'PUT', body }, XEUtils.isString(options) ? { url: options } : options)
        return request(ajaxOpts).then(response => response.data)
      }
    }
  }
})
// 创建一个字典翻译渲染器
VXETable.renderer.add('DICT', {
    renderDefault (h, renderOpts, params) {
        const { props } = renderOpts
        const { row, column } = params
        const cellValue = XEUtils.get(row, column.property)
        const rest = store.getters.ddMap[props.code]
        const item = rest && rest.find(item => item.value === cellValue)
        return [
            h('span', {
                style: {
                    color: cellValue === '1' ? 'green' : 'red'
                }
            }, item ? item.label : '')
        ]
    }
})

// 创建一个表单-按钮组渲染器
VXETable.renderer.add('FormItemButtonGroup', {
    // 项显示模板
    renderItem (h, renderOpts, params, context) {
        return [
            <vxe-button type="submit" status="primary">查询</vxe-button>,
            <vxe-button type="reset">重置</vxe-button>
    ]
    }
})
export {VXETable};
